<template>
  <div class="entryDefault">
    <div class="cardList">
      <a-card class="cardItem" v-for="(item, index) in list" :key="index" hoverable @click="onClickItem(item)">
        <img slot="cover" alt="example" src="https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png" />
        <a-card-meta :title="item.title" :description="item.desc">
          <a-avatar slot="avatar" src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />
        </a-card-meta>
      </a-card>
    </div>
  </div>
</template>
<script>
export default {
  name: 'entryDefault',
  description: '默认入口',
  computed: {
    geoJsonShow() {
      return false
    },
    geoJsonBaseUrl() {
      return []
    },
  },
  data() {
    return {
      list: [
        {
          title: '视频调绘',
          desc: '视频中直接绘制点、线、面',
          path: '/videoDraw',
        },
        {
          title: '指标展示',
          desc: '使用数字矿山中提取的组件库',
          path: '/topState',
        },
        {
          title: '展示vue文件',
          desc: '使用Vue Code View插件展示vue源文件页面',
          path: '/codeView',
        },
      ],
    }
  },
  mounted() {
    this.$store.commit('map/SET_MAP_READY', false)
  },
  methods: {
    onClickItem(item) {
      this.$router.push(item.path)
    },
  },
}
</script>
<style lang="scss" scoped>
.entryDefault {
  width: 100vw;
  height: 100vh;
  .cardList {
    padding: 20px;
    display: flex;
    .cardItem {
      margin: 20px;
    }
  }
}
</style>
